<div class="order-wrapper">
  <form #orderForm="ngForm">
    <div class="form-group">
      <div class="form-item">
        <label class="form-item-label">客户名称</label>
        <div class="form-item-field">
          <input type="text" [(ngModel)]="formData.userName" class="form-control" name="userName">
        </div>
      </div>
      <div class="form-item">
        <label class="form-item-label">交货日期</label>
        <div class="form-item-field relative">
          <input type="text" class="form-control" [(ngModel)]="formData.time" name="time"  [matDatepicker]="picker" placeholder="选择日期">
          <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
          <mat-datepicker #picker></mat-datepicker>
        </div>
      </div>
      <div class="form-item">
        <label class="form-item-label">单号</label>
        <div class="form-item-field">
          <input type="text" [(ngModel)]="formData.prodNum" class="form-control" name="prodNum">
        </div>
      </div>
      <div class="form-item">
        <label class="form-item-label">选择产品</label>
        <div class="form-item-field">
          <div class="form-control">
            <mat-select name="product-param" [(ngModel)]="formData.currentPro" (selectionChange)="changeHandle()">
              <mat-option *ngFor="let p of products" [value]="p">{{p.name}}</mat-option>
            </mat-select>
          </div>
        </div>
      </div>
      <div class="form-item">
        <label class="form-item-label">高(h)</label>
        <div class="form-item-field">
          <input type="number" [(ngModel)]="formData.height" class="form-control" name="height">
        </div>
      </div>
      <div class="form-item">
        <label class="form-item-label">宽(w)</label>
        <div class="form-item-field">
          <input type="number" [(ngModel)]="formData.width" class="form-control" name="width">
        </div>
      </div>
      <div class="form-item full-width">
        <label class="form-item-label">备注</label>
        <div class="form-item-field">
          <textarea type="text" [(ngModel)]="formData.remark" class="form-control" name="desc"></textarea>
        </div>
      </div>
    </div>
    <div class="result" *ngIf="formData.currentPro">
      <div class="param-item" *ngFor="let param of formData.currentPro.params">
        <span class="sp1">{{param.desc}}：</span>
        <span class="sp2" *ngFor="let subP of param.subParams">
          <i>{{subP.desc}}（{{subP.alias.h}}：{{subP.h(formData.height) | number:'0.0-3'}}，{{subP.alias.w}}：{{subP.w(formData.width) | number:'0.0-3'}}）</i>
        </span>
      </div>
    </div>
    <div class="operate-group">
      <button mat-raised-button color="primary" (click)="onClickPrint()">打印</button>
    </div>
  </form>
</div>
